<script>
import "xterm/css/xterm.css";
import { Terminal } from "xterm";
import { FitAddon } from "xterm-addon-fit";
// import { AttachAddon } from "xterm-addon-attach";
export default {
  name: "terminal",
  data() {
    return {
      term: "",//terminal 黑窗口容器
      prefix: "[root@serverip ~]# ",//前缀
      inputText: "",//输入内容，每次回车后进行ws通信然后清空此数据
    };
  },
  watch: {},
  methods: {
    //初始化黑窗口
    async initTerm() {
      const fitAddon = new FitAddon();
      this.term = new Terminal({
        fontSize: 14,
        cursorBlink: true,
        allowProposedApi: true,
        disableStdin: false,
        LogLevel: "debug",
      });

      this.term.loadAddon(fitAddon);
      //开启Xterm终端
      this.term.open(document.getElementById("xterm"));
      this.term.writeln("\x1b[1;1;32mwellcom to web terminal!\x1b[0m");
      this.term.write(this.prefix); //黑窗口 前缀

      await this.termPromt(); //term.promt
      await this.termKeyCode(); //事件

      fitAddon.fit(); //黑窗口适应实际div宽高
      this.term.focus(); //自动聚焦
    },
    //事件

    //写入黑窗口
    wirteTerm(data) {
      console.log("写入黑窗口", data);
      this.term.writeln(data);
      this.term.prompt();
    },
    //加载基础数据
    pageLoad(data) {
      this.selectObj = data;
      this.drawerFlag = true;
      this.$nextTick(() => {
        this.initTerm();
      });
    },
    cancelClick() {
      this.drawerFlag = false;
      //关闭弹框
      this.term.dispose(document.getElementById("xterm"));
    },
  },
};
</script>
